import { Col, Row } from 'antd';
import React, { useContext } from 'react';
import cls from 'classnames';
import { ResourcesContext, useResourRangeData } from '../hooks';
import { ResourRangeContext } from '../hooks/useResourRangeContext';
import { useResourRangeReducer } from '../hooks/useResourRangeReducer';
import { ResourceRangeLeftTree } from './ResourceRangeLeftTree';
import { ResourceRangeRightSearch } from './ResourceRangeRightSearch';
import { ResourceRangeRightTable } from './ResourceRangeRightTable';
import { IResourceRange } from '../type';

export const ResourceRange: React.FC<IResourceRange> = ({
  resCurrKey, //用于判断是数据范围(resRange) 还是功能操作 (resOpera)
}) => {
  const { prefixCls } = useContext(ResourcesContext);

  const {
    treeData,
    tableLoading,
    tableDataSource,
    treeLoading,
    reloadTree,
    reloadTableDataSource,
  } = useResourRangeData(resCurrKey); //获取管理页面数据

  const {
    searchValue,
    selectKeys,
    expandedKeys,
    autoExpandParent,
    searchTableValue,
    expandedRowKeys,
    checkedRowKeys,
    checkTableRows,
    resRangeDispatch,
  } = useResourRangeReducer(); //获取reducer

  return (
    <>
      <ResourRangeContext.Provider
        value={{
          treeData, //左侧树 数据
          selectKeys, //左侧树 选中 key
          searchValue, //左侧树 搜索值
          expandedKeys, //左侧树 打开的节点 key
          autoExpandParent, //是否自动展开树节点
          searchTableValue, //右侧table 的搜索值
          expandedRowKeys, //右侧 table 的展开节点 key
          treeLoading, //左侧树请求接口loading
          checkedRowKeys, //保存右侧表格数据 key (表格前的 radio 选中)
          checkTableRows, //保存 右侧表格点击选中的数据
          resRangeDispatch, //reducer 派发方法
          reloadTableDataSource, //刷新右侧表格 的方法
        }}
      >
        <Row gutter={[4, 0]} className={prefixCls + 'rowTwo'}>
          <ResourceRangeLeftTree
            treeLoading={treeLoading}
            reloadTree={reloadTree}
          />
          <Col span={18} className={cls(prefixCls + 'bottomCol')}>
            <div className={cls(prefixCls + 'table-box')}>
              <ResourceRangeRightSearch
                dataSource={tableDataSource}
                // currentType={resCurrKey}
              />
              <ResourceRangeRightTable
                dataSource={tableDataSource}
                tableLoading={tableLoading}
                // currentType={resCurrKey}
              />
            </div>
          </Col>
        </Row>
      </ResourRangeContext.Provider>
    </>
  );
};
